<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>银行客户</title>
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/common.css">
    <script src="js/vue.js"></script>
    <script src="js/echarts.js"></script>
    <script src="js/axios.js"></script>
<!--    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>-->
</head>
<body>
<!--顶部盒子-->
<div class="top">
    <div class="top_center">客户基本信息</div>
</div>
<!--第一页中间部分的盒子-->
<div class="main_box">
    <div class="main_left">
        <div class="left-demo" style="margin-bottom: 2%">
            <span class="j_1"></span>
            <span class="j_2"></span>
            <span class="j_3"></span>
            <span class="j_4"></span>
            <div class="title"><img src="img/page1/icon3.png"/>本行员工占比</div>
            <div id="degreeSum" class="chart"></div>
            <script src="js/degreeSum.js"></script>
        </div>
        <div class="left-demo" style="margin-bottom: 2%">
            <span class="j_1"></span>
            <span class="j_2"></span>
            <span class="j_3"></span>
            <span class="j_4"></span>
            <div class="title"><img src="img/page1/icon6.png"/>客户贷款数占比</div>
            <div id="chartDegree" class="chart"></div>
            <script src="js/chartDegree.js"></script>
        </div>

        <div class="left-demo">
            <span class="j_1"></span>
            <span class="j_2"></span>
            <span class="j_3"></span>
            <span class="j_4"></span>
            <div class="title"><img src="img/page1/icon1.png"/>vip占比</div>
            <div id="hot1" class="chart"></div>
            <script src="js/hot1.js"></script>
        </div>
    </div>

    <div class="main_center">
        <div class="center_realBottom">
            <span class="j_1"></span>
            <span class="j_2"></span>
            <span class="j_3"></span>
            <span class="j_4"></span>
            <div class="title"><img src="img/page1/icon2.png"/>客户总数</div>
            <div class="sq_data">
                <div class="font">
                    <font id="sum" class="font3 qianlan" face="font01"></font>
                </div>
                <script src="js/forTable.js"></script>
            </div>
        </div>
        <div class="center_bottom">
            <span class="j_1"></span>
            <span class="j_2"></span>
            <span class="j_3"></span>
            <span class="j_4"></span>
            <div class="title"><img src="img/page1/icon2.png"/>客户职业统计</div>
            <div id="myMap"></div>
        </div>
    </div>

    <div class="main_right">
        <div class="right-demo" style="margin-bottom: 2%">
            <span class="j_1"></span>
            <span class="j_2"></span>
            <span class="j_3"></span>
            <span class="j_4"></span>
            <div class="title"><img src="img/page1/icon3.png"/>客户年龄</div>
            <div id="age" class="chart"></div>
            <script src="js/specialistSum.js"></script>
        </div>
        <div class="right-demo" style="margin-bottom: 2%">
            <span class="j_1"></span>
            <span class="j_2"></span>
            <span class="j_3"></span>
            <span class="j_4"></span>
            <div class="title"><img src="img/page1/icon6.png"/>客户等级</div>
            <div id="chartSpecialist" class="chart"></div>
            <script src="js/chartSpecialist.js"></script>
        </div>
        <div class="right-demo">
            <span class="j_1"></span>
            <span class="j_2"></span>
            <span class="j_3"></span>
            <span class="j_4"></span>
            <div class="title"><img src="img/page1/icon1.png"/>客户性别</div>
            <div id="hot2" class="chart"></div>
            <script src="js/hot2.js"></script>
        </div>
    </div>
</div>
<!--<script src="js/axios.js"></script>-->
<script src="js/china.js"></script>
<script src="js/getMap.js"></script>
<script src="js/forTable.js"></script>
</body>
</html>
